<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>预加载页面（跨站跳转）</title>
</head>

<body>
  <h1>预加载页面（跨站跳转）</h1>
  <div id="divInfo"></div>
  <!-- 通过iframe加载页面 -->
  <iframe style="width: 0px;height: 0px;" id="myframe" src="" frameborder="0"></iframe>

  <script src="https://cdn.bootcdn.net/ajax/libs/qs/6.10.1/qs.min.js"></script>

  <script>
    // 获取页面参数信息
    let queryString = location.search.replace('?', '');
    let qsJson = Qs.parse(queryString);
    console.log(queryString, qsJson);

    document.querySelector('title').innerHTML = qsJson.title;
    document.getElementById('divInfo').innerHTML = qsJson.info;

    let redirect_url = qsJson.url
    // 通过延时执行模拟业务逻辑延迟跳转
    // setTimeout(() => {
    //   location = redirect_url;
    // }, 5000)
    let myframe = document.getElementById('myframe')
    myframe.setAttribute('src', redirect_url)

    window.addEventListener('message', function (ev) {
      console.log('接收到跨域信息：', ev)
      // 通过消息的内容判定动作
      if ('loaded' == ev.data) {
        location = redirect_url;
      }
    })

    

  </script>
</body>

</html>